import {
    _decorator,
    Component,
    Node,
    NodeEventType,
    Size,
    Sprite,
    Touch,
    UITransform,
    v2,
    v3,
    Vec3,
    Vec4,
} from 'cc';
const { ccclass, property } = _decorator;

@ccclass('PageMove')
export class PageMove extends Component {
    vector4: Vec4 = new Vec4(0, 0, 0, 0);

    size: Size = Size.ZERO;
    onLoad() {
        this.node.on(Node.EventType.TOUCH_START, this.onTouchStart, this);
        this.node.on(Node.EventType.TOUCH_MOVE, this.onTouchMove, this);
        this.node.on(Node.EventType.TOUCH_END, this.onTouchEnd, this);
        this.node.on(Node.EventType.TOUCH_CANCEL, this.onTouchEnd, this);

        this.size = this.node.getComponent(UITransform).contentSize;
        console.log('size', this.size);
    }

    start() {
        const sp = this.node.getComponent(Sprite);
        const meta = sp.getRenderMaterial(0);
        meta.setProperty(
            'iResolution',
            new Vec4(this.size.width, this.size.height, 1, 1),
        );
        console.log('iResolution', this.size);
    }

    update(deltaTime: number) {}

    onTouchStart(touch: Touch) {
        this.vector4.z = touch.getLocationX();
        this.vector4.w = touch.getLocationY();
    }

    onTouchMove(touch: Touch) {
        this.vector4.x = touch.getLocationX();
        this.vector4.y = touch.getLocationY();

        this.setProperty(this.vector4);
    }

    onTouchEnd() {}

    setProperty(vector: Vec4) {
        const sp = this.node.getComponent(Sprite);
        const meta = sp.getRenderMaterial(0);
        meta.setProperty('iMouse', vector);
        console.log('iMouse', vector);
    }
}
